{% extends "base.html" %}
{% block header %}
<script type="text/javascript" src="/static/js/jquery.treeview.js"></script>
<script type="text/javascript" src="/static/js/jquery.cookie.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$(".tabs > ul").tabs();
    $("#browser").treeview({
        collapsed:true,
        persist: "cookie",
		toggle: function() {
			console.log("%s was toggled.", $(this).find(">span").text());
		}
	});

});
</script>
{% endblock %}

{% block menu %}
<ul class="box">
	<li><a href="/index"><span>首页</span></a></li>
	<li><a href="/monitor"><span>服务监控</span></a></li>
	<li><a href="/report"><span>服务报表</span></a></li>
	<li><a href="/alert"><span>报警管理</span></a></li>
	<li><a href="/flow"><span>流程管理</span></a></li>
	<li><a href="/doc"><span>运维文档</span></a></li>
	<li id="menu-active"><a href="/host"><span>服务主机</span></a></li>
	<li><a href="/accident"><span>事故中心</span></a></li>
</ul>
{% endblock %}

{% block aside %}
<div class='left-col'>
{% autoescape off %}
    {{ tree }}
{% endautoescape %}
</div>
{% endblock %}



{% block content %}
<div id="mon-tit">
    <div class="left">暴风主机管理 >> 所有主机</div>
    <div class="right"><a>添加主机</a></div>
</div>
<div class="clr"></div>
<hr>

	<div id="mon-dis" class="right-col">
	    <div class="title">
			<span style="width:25%">IP</span>
			<span style="width:25%">IDC</span>
			<span style="width:36%">主机名</span>
			<span style="width:14%">操作</span>
	    </div>
		{% for l in lst %}
		<div class="{% cycle 'ji' 'ou' %}" >
		    <span style="width:25%">{{ l.ip }}</span>
		    <span style="width:25%">{{ l.idc }}</span>
		    <span style="width:36%">{{ l.name }}</span>
		    <span style="width:14%"><a href="hostinfo?id={{ l.id }}">查看详情</a></span>
	    </div>
		{% endfor %}
	</div>
<hr>
    <div class='clr'></div>
        <div class='page'>
		{% for p in page_lst %}
            {% if p == page %}
            <a class='on' href='/report?page={{p}}'>{{p}}</a>
            {%else%}
            <a href='/host/list/{{pid}}?page={{p}}'>{{p}}</a>
            {% endif %}
        {% endfor %}    

        </div>

{% endblock %}
